.w{
	width: 88.4%;
	margin: 0 auto;
}
html{
	min-height: 100%;
}
.luckdraw{
	width: 100%;
	height: 100%;
	background:#3684e3;
	background: -webkit-linear-gradient(#3684e3 ,#1bc4d3);
	background: linear-gradient(#3684e3 ,#1bc4d3);
	background-repeat: no-repeat;
}

.header{
	padding: 50px 0 20px;
	height: 6%;
}

.header .logo{
	width: 20%;
}

.header span{
	display: inline-block;
	width: 66%;
	padding: 20px;
	font-size: 37px;
	text-align: center;
	font-weight: bold;
	color: #fff;
	background: #3280cd;
	border-radius: 10px;
}

.header .qr-code{
	width: 8.5%;
}
.sign{
	height: 4%;
	font-size: 30px;
	line-height: 66px;
	color: #fff;
	text-align: right;
}
.list{
	height: 60%;
	overflow: hidden;
}
.list li{
	float: left;
	width: 9.4%;
	padding-top: 9.4%;
	margin-left: 0.6%;
	margin-bottom: 0.6%;
	background:url(../img/hico5.png) center center no-repeat;
	background:url(../img/hico5.png) center center/100% 100% no-repeat;
	-webkit-transition: 0.8s;
	transition: 0.8s
}
.list li:hover{
	background-image: url(../img/hico6.png);
}

.footer{
	padding-top: 30px;
}

.footer .function{
	height: 5%;
	width: 82%;
	background: #63cfe2;
}

.footer .function img{
	vertical-align: middle;
}

.footer .function .rand{
	padding-left: 10px;
}

.footer .function .pic{
	margin: 0 20px;
	width: 64px;
	border: 2px solid #fff;
	border-radius: 50%;
}

.footer .function i{
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

.footer .function span{
	font-size: 30px;
	color: #fff;
	vertical-align: middle;
}

.footer .function .fr{
	width: 11%;
	height: 84px;
	text-align: center;
	font-size: 30px;
	color: #fff;
	line-height: 84px;
	background: #ea2454;
	border-radius: 10px;
}

.footer .message{
	margin-top: 12px;
	width: 16%;
	height: 55px;
	font-size: 30px;
	line-height: 55px;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	background: #2b9fdd;
	border-radius: 10px;
}
